import Taro, { Component } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
import './adddisease.css'
import { AtAccordion,AtList, AtListItem,AtTextarea,AtImagePicker,AtButton  } from 'taro-ui'
import reactMixin from 'react-mixin';
import myJs from './adddiseaseJs.js'
import app from '../../../main.js'
export default class AddDisease extends Component {

  config = {
    navigationBarTitleText: '添加病程'
  }
  constructor () { 
        super(...arguments); 
        this.state = this.getData(); 
    }

 init(){
  this.state.case_course.case_type='手术';
  this.state.case_course.report_images=[];
  this.state.case_course.medical_images=[];
  this.state.case_course.case_images=[];
   this.setState({
     open:true,
     open2:true,
     case_course:this.state.case_course
   },()=>{
     console.log(this.state.case_course.report_images);
     console.log(this.state.case_course.medical_images);
     console.log(this.state.case_course.case_images);
   })
 }
 //改变时间
 onDateChange(e){
    this.setState({
      visit_at:e.detail.value
    })
 }
 beforeCreateCaseCourse(data){
   return true;
 }
//改变病程的类型
changeTypeText(e){
  this.state.case_course.case_type=e.target.dataset.text;
  this.setState({
    case_course:this.state.case_course
  })
}
//上传图片
choosePhotoes=()=>{
  let that=this;
        Taro.uploadFile({
          url: app.apiUri +'/admin/upload/image' ,
          filePath: that.state.case_course.report_images[0].url,  
          name:'file', 
          success(res) {
            if (res.statusCode == 413) {
              app.toast('文件过大，请重新上传');
              return;
            }
          }
        })
}


  render () {
    return (
      <View className='add-disease'>
        <View className='nav'>
        <AtAccordion
        title={'请选择类型：'+this.state.case_course.case_type}
        className='first'
        open={this.state.open}
        onClick={this.handleChange.bind(this,'open')}
        >
        <AtList hasBorder={false}>
          <View
            onClick={this.changeTypeText.bind(this)}
          >
            <AtListItem
            title='手术'
            data-text='手术'
            />
          </View>
          <View
            onClick={this.changeTypeText.bind(this)}
          >
            <AtListItem
            title='复诊'
            data-text='复诊'
            />
          </View>
        </AtList>
        </AtAccordion>
        <View className='page-section'>
          <View>
            <Picker  mode='date' onChange={this.onDateChange}>
              <View className='picker'>
                请选择时间：<Text className='time'>{this.state.visit_at}</Text>
              </View>
            </Picker>
          </View>
        </View>
        </View>    
        <AtListItem title='病程描述' hasBorder={false}/>
        <AtTextarea
        className='tarea'
        count={false}
        value={this.state.case_course.summary}
        onChange={this.handleTextareaChange.bind(this,'case_course.summary')}
        maxLength={200}
        placeholder='文字记录...'
        /> 
        <AtListItem title='检查报告' hasBorder={false}/>
        <AtImagePicker
        className='upload'
        files={this.state.case_course.report_images}
        onChange={this.handleChange.bind(this,'case_course.report_images')}

        />
        <AtListItem title='检查影像' hasBorder={false}/>
        <AtImagePicker
        className='upload'
        files={this.state.case_course.medical_images}
        onChange={this.handleChange.bind(this,'case_course.medical_images')}
        />
        <AtListItem title='纸质病历' hasBorder={false}/>
        <AtImagePicker
        className='upload'
        files={this.state.case_course.case_images}
        onChange={this.handleChange.bind(this,'case_course.case_images')}
        />
        <View className='blank-box'></View>
        <View className='btn-box'><AtButton className='save-btn' onClick={this.choosePhotoes}>保存</AtButton></View>
      </View>
    )
  }
}
reactMixin.onClass(AddDisease,myJs);
